var imageUtil = require('../../utils/util.js');


Page({

  /**
   * 页面的初始数据
   */
  data: {
    maskshow: true,
    maskshowlist: true,



    imagefirstsrc: 'http://img5.imgtn.bdimg.com/it/u=1614225512,3338177827&fm=27&gp=0.jpg',//图片链接  
    imagesecondsrc: 'http://bpic.588ku.com/back_pic/04/07/63/28581203949ca9d.jpg!/fw/400/quality/90/unsharp/true/compress/true',//图片链接  
    imagethirdsrc: 'http://img1.gtimg.com/ent/pics/hv1/13/71/2061/134034643.jpg',
    imagewidth: 0,//缩放后的宽  
    imageheight: 0,//缩放后的高  



    // 假数据
    list: [
      { 'img': 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1526544985&di=ac575c8bcbd103e2c32923d19c3c63f2&imgtype=jpg&er=1&src=http%3A%2F%2Fwww.beautynail.cc%2FUploadFiles%2F201281693929251.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind1': 'tomy', 'bind2': '' },
      { 'img': 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=800698531,3635976751&fm=27&gp=0.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind1': 'tomy', 'bind2': '' },
      { 'img': 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1538223403,2825761364&fm=27&gp=0.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind': 'tomy' },
      { 'img': 'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1677098619,677475012&fm=27&gp=0.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind': 'tomy' },
      { 'img': 'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=4220995434,3449773504&fm=11&gp=0.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind': 'show' },
      { 'img': 'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=913728026,1936501943&fm=27&gp=0.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind': 'show' },
      { 'img': 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=3558612933,4284711335&fm=27&gp=0.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind': 'show' },
      { 'img': 'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1968216948,3836372320&fm=27&gp=0.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind': 'show' },
      { 'img': 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2155026582,3101938338&fm=11&gp=0.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind': 'show' },
      { 'img': 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3167081413,611706082&fm=11&gp=0.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind': 'show' },
      { 'img': 'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=2496766409,1043043518&fm=27&gp=0.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind': 'show' },
      { 'img': 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=943543745,3810760363&fm=27&gp=0.jpg', 'til': '美甲功能油的介绍和用法，您是否还只是图图', 'bind': 'show' },

    ],
    // 只显示当前遮罩
    indexs: null,
  },

  imageLoad: function (e) {
    var imageSize = imageUtil.imageUtil(e)
    this.setData({
      imagewidth: imageSize.imageWidth,
      imageheight: imageSize.imageHeight
    })
  },
  // 收藏成功
  shouOK:function() {
    wx.showToast({
      title: '收藏成功',
      icon: 'success',
      duration: 1000
    })
  },
  // 分享成功
  fenOK: function () {
    wx.showToast({
      title: '分享成功',
      icon: 'success',
      duration: 1000
    })
  },

  // 跳转到wod 
  tomy: function () {
    console.log("跳转到了我的界面")
    wx.switchTab({
      url: './showdetail',
      success: function(res) {},
      fail: function(res) {},
      complete: function(res) {},
    })

  },
  // 防止遮罩层穿透
  myCatchTouch: function () {
    console.log('stop user scroll it!');
    return;
  },

  // 点击显示隐藏
  show: function () {
    this.setData({
      maskshow: !this.data.maskshow
    })
  },
  // 点击显示隐藏
  showlist: function () {
    this.setData({
      maskshowlist: !this.data.maskshowlist
    })
  },


  onLoad: function () {

    this.setData({
      list: this.data.list,
    })
    console.log(this.data.list)

  },
  // ----------------------------------------------------------

  // 触摸开始时间
  touchStartTime: 0,
  // 触摸结束时间
  touchEndTime: 0,
  // 最后一次单击事件点击发生时间
  lastTapTime: 0,
  // 单击事件点击后要触发的函数
  lastTapTimeoutFunc: null,



  /// 按钮触摸开始触发的事件
  touchStart: function (e) {
    this.touchStartTime = e.timeStamp
  },

  /// 按钮触摸结束触发的事件
  touchEnd: function (e) {
    this.touchEndTime = e.timeStamp
  },
  /// 单击
  tap: function (e) {
    var that = this
    wx.showModal({
      title: '提示',
      content: '单击事件被触发',
      showCancel: false
    })
  },

  /// 双击
  doubleTap: function (e) {
    var that = this
    // 控制点击事件在350ms内触发，加这层判断是为了防止长按时会触发点击事件
    if (that.touchEndTime - that.touchStartTime < 350) {
      // 当前点击的时间
      var currentTime = e.timeStamp
      var lastTapTime = that.lastTapTime
      // 更新最后一次点击时间
      that.lastTapTime = currentTime

      // 如果两次点击时间在300毫秒内，则认为是双击事件
      if (currentTime - lastTapTime < 300) {
        console.log("double tap")
        // 成功触发双击事件时，取消单击事件的执行
        clearTimeout(that.lastTapTimeoutFunc);
        wx.showModal({
          title: '提示',
          content: '双击事件被触发',
          showCancel: false
        })
      }
    }
  },

  /// 长按
  longTap: function (e) {
    console.log("long tap")
    wx.showModal({
      title: '提示',
      content: '长按事件被触发',
      showCancel: false
    })
  },

  /// 单击、双击
  multipleTap: function (e) {
    var that = this
    // 控制点击事件在350ms内触发，加这层判断是为了防止长按时会触发点击事件
    if (that.touchEndTime - that.touchStartTime < 350) {
      // 当前点击的时间
      var currentTime = e.timeStamp
      var lastTapTime = that.lastTapTime
      // 更新最后一次点击时间
      that.lastTapTime = currentTime

      // 如果两次点击时间在300毫秒内，则认为是双击事件
      if (currentTime - lastTapTime < 300) {
        console.log("double tap")
        // 成功触发双击事件时，取消单击事件的执行
        clearTimeout(that.lastTapTimeoutFunc);
        wx.navigateTo({
          url: './showdetail',
          success: function (res) { },
          fail: function (res) { },
          complete: function (res) { },
        })
      } else {
        // 单击事件延时300毫秒执行，这和最初的浏览器的点击300ms延时有点像。
        that.lastTapTimeoutFunc = setTimeout(function () {
          console.log("tap")
          wx.navigateTo({
            url: './showdetail',
            success: function (res) { },
            fail: function (res) { },
            complete: function (res) { },
          })
        }, 300);
      }
    }
  },

  // ----------------------------------------------------------


  // +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
  tap:function(){
    this.setData({
      maskshow:true
    })
  },
  
  mytouchstart: function (e) {
    console.log(e.timeStamp + '- touch start')

  },
  //长按事件
  // mylongtap: function (e) {
  //   console.log(e.timeStamp + '- long tap')
  //   this.setData({
  //     maskshow: false,
  //     indexs: index,
  //   })
  // },

  mytouchend: function (e) {
    console.log(e.timeStamp + '- touch end')
  },
  mytap: function (e) {
    wx.navigateTo({
      url: './showdetail',
      success: function(res) {},
      fail: function(res) {},
      complete: function(res) {},
    })

  },

  /// 长按
  longTap: function (e) {
    console.log("点击了 长按")
    var index = e.currentTarget.dataset.indexs;
    this.setData({
      maskshow: !this.data.maskshow,
      indexs: index,
    })
    return false
  },

  // 判断单击和长按


  // +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
})